<div class="row" *ngIf="(listConfig && listConfig.content && listConfig.content.length)">
    <div class="col-md-12">
        <table class="table table-bordered">
            <thead>
            <tr>
                <th>NO.</th>
                <th *ngFor="let li of listConfig.content">{{li.label}}</th>
                <th *ngIf="hasFunction('edit') || hasFunction('delete')">Operation</th>
            </tr>
            </thead>
            <tbody>
            <tr *ngFor="let data of model; let i = index;">
                <td>{{i+1}}</td>
                <td class="ellipsis" *ngFor="let li of listConfig.content" [title]="data[li.key]" style="max-width: 400px;">{{data[li.key]}}</td>
                <td *ngIf="hasFunction('edit') || hasFunction('delete')">
                    <a class="btn btn-default" *ngIf="hasFunction('edit')" (click)="edit(i)">Edit</a>
                    <a class="btn btn-danger" *ngIf="hasFunction('delete')" (click)="delete(i)">Delete</a>
                </td>
            </tr>
            </tbody>
        </table>
    </div>
</div>
<a class="btn btn-info" *ngIf="hasFunction('add')" (click)="edit(-1)">New</a>

<div class="modal" *ngIf="hasFunction('edit') || hasFunction('add')" [hidden]="!isShown">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close" data-dismiss="modal" (click)="isShown = false;"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">{{isEdit > -1 ? 'Edit' : 'New'}}</h4>
            </div>
            <div class="modal-body">
                <dynamic-form *ngIf="isShown" [config]="formConfig" [(model)]="formModel"></dynamic-form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal" (click)="isShown = false;">Cancel</button>
                <button type="button" class="btn btn-primary" [disabled]="!formModel.valid" (click)="save()">Save</button>
            </div>
        </div>
    </div>
</div>